<template>
    <div>
        <div class="header">
            <router-link to=""><img style="display: none"/></router-link>
            <!--            <h2>水表报修</h2>-->
            <router-link class="sq" :to="{path:'/tap-water/apply',query:{reg:'城市'}}" style="text-align: right">申请报修
            </router-link>
        </div>
        <div class="sqbx_bt">
            <van-tabs v-model="activeName" swipeable type="card" color="#22c7da">
                <van-tab title="未处理" name="未处理">
                </van-tab>
                <van-tab title="处理中" name="处理中">
                </van-tab>
                <van-tab title="已处理" name="已处理">
                </van-tab>
            </van-tabs>
        </div>

        <div class="sqbx_list">
            <ul class="mui-table-view">
                <water-fix-table-list :region="region" :tag="activeName"></water-fix-table-list>
            </ul>
        </div>
    </div>
</template>

<script>
    import Vue from 'vue';
    import {Tab, Tabs} from 'vant';
    import 'vant/lib/tab/style';
    import 'vant/lib/tabs/style';
    import waterFixTableList from '@/componets/water-fix-table';

    Vue.use(Tab);
    Vue.use(Tabs);
    export default {
        name: "city_repair",
        components: {waterFixTableList},
        data() {
            return {
                activeName: '未处理',
                region: "城市"
            }
        }
    }
</script>

<style>
    @import "../../assets/tap-water/css/base.css";
    @import "../../assets/tap-water/css/other.css";
    /*@import "../../assets/tap-water/css/mui.min.css";*/
    @import "../../assets/sfj/css/resetui.css";

    .mui-table-view-cell {
        position: relative;
        overflow: hidden;
        padding: 11px 15px;
        -webkit-touch-callout: none;
    }

    .mui-table-view-cell:after {
        position: absolute;
        right: 0;
        bottom: 0;
        left: 15px;
        height: 1px;
        content: '';
        transform: scaleY(.5);
    }
</style>